<template>
    <div id="editConference">
      <el-descriptions id="conferenceData" class="margin-top" :column="2" border>
        <el-descriptions-item>
          <template #label>
            <div class="cell-item">
              <el-icon :style="iconStyle">
                <conference />
              </el-icon>
              会议ID
            </div>
          </template>
          {{ editConferenceId }}
        </el-descriptions-item>
        <el-descriptions-item>
          <template #label>
            <div class="cell-item">
              <el-icon :style="iconStyle">
                <conference />
              </el-icon>
              会议名
            </div>
          </template>
          <el-input v-model="editConferenceName"></el-input>
        </el-descriptions-item>
        <el-descriptions-item>
          <template #label>
            <div class="cell-item">
              <el-icon :style="iconStyle">
                <address />
              </el-icon>
              会议地址
            </div>
          </template>
          <el-input v-model="editAddress"></el-input>
        </el-descriptions-item>
        <el-descriptions-item>
          <template #label>
            <div class="cell-item">
              <el-icon :style="iconStyle">
                <startTime />
              </el-icon>
              开始时间
            </div>
          </template>
          <el-input v-model="editStartTime"></el-input>
        </el-descriptions-item>
        <el-descriptions-item>
          <template #label>
            <div class="cell-item">
              <el-icon :style="iconStyle">
                <endTime />
              </el-icon>
              结束时间
            </div>
          </template>
          <el-input v-model="editEndTime"></el-input>
        </el-descriptions-item>
        <el-descriptions-item>
          <template #label>
            <div class="cell-item">
              <el-icon :style="iconStyle">
                <comm />
              </el-icon>
              备注
            </div>
          </template>
          <el-input v-model="editComm"></el-input>
        </el-descriptions-item>
      </el-descriptions>
      <div id="buttons">
        <el-button type="primary" @click="getConferenceData">立即刷新</el-button>
        <el-button type="primary" @click="updateConferenceData" v-if="isAdmin === 'true'">更新会议信息</el-button>
      </div>
    </div>
  </template>
  
  <script>
  import axios from "axios";
  import { baseUrl } from "../main.js";
  import { show_success_msg, show_error_msg } from "../js/msg.js";
  export default {
    props: {
      editConferenceId: String,
    },
    data() {
      return {
        baseUrl: baseUrl,
        editConferenceName: "加载中...",
        editAddress: "加载中...",
        editStartTime: "加载中...",
        editEndTime: "加载中...",
        editComm: "加载中...",
        isAdmin: localStorage.getItem("admin")
      };
    },
    methods: {
      getConferenceData() {
        axios
          .get(this.baseUrl + "/Conference/findById?id=" + this.editConferenceId)
          .then((response) => {
            let re_data = response.data;
            if (re_data.status == 200) {
              this.editConferenceName = re_data.data.name;
              this.editAddress = re_data.data.address;
              this.editStartTime = new Date(
                re_data.data.startTime
              ).toLocaleString();
              this.editEndTime = new Date(
                re_data.data.endTime
              ).toLocaleString();
              this.editComm = re_data.data.comm;
              show_success_msg("获取会议信息成功");
            } else {
              show_error_msg("获取会议信息失败", re_data.msg);
            }
          })
          .catch((error) => {
            show_error_msg("读取失败", "与服务器通讯异常");
          });
      },
      updateConferenceData() {
        let fromdata = new FormData();
        fromdata.append("id", this.editConferenceId);
        fromdata.append("name", this.editConferenceName);
        fromdata.append("address", this.editAddress);
        fromdata.append("startTime", this.editStartTime = new Date(this.editStartTime).getTime());
        fromdata.append("endTime", this.editEndTime = new Date(this.editEndTime).getTime());
        fromdata.append("comm", this.editComm);
        axios
          .post(this.baseUrl + "/Conference/updateConferenceInfo", fromdata)
          .then((response) => {
            let re_data = response.data;
            if (re_data.status == 200) {
              show_success_msg("更新会议信息成功", "");
              this.getConferenceData();
            } else {
              show_error_msg("更新会议信息失败", re_data.msg);
            }
          })
          .catch((error) => {
            show_error_msg("更新失败", "与服务器通讯异常");
          });
      },
    },
    mounted() {
      this.getConferenceData();
    },
  };
  </script>
  
  <style scoped>
  #editUser > #userData {
    margin-top: 12px;
  }
  
  #buttons {
    margin-top: 2vh;
  }
  </style>